
import './Workbenches.scss'
import dayjs from 'dayjs'
import { useRequest } from 'alova/client'
import { useState } from 'react'
import { Calendar, Tabs } from "antd"
import { useMount, useRafInterval } from 'ahooks'


import { Http } from '../../Utils/Api'
import { GetIndexedDB } from '../../Utils/IndexedDB'
import { UserAvatar, UserBackboard } from '../../Config/theme'

const poemArray = [
    '子夜月清寒，幽窗梦未安。',
    '丑时霜露重，荒径犬声残。',
    '寅刻晓星稀，寒林宿鸟啼。',
    '卯晨霞染岫，幽涧水潺湲。',
    '辰刻雾烟开，墟村人往来。',
    '巳日暖阳娇，繁花映小桥。',
    '午间炎日炽，倦柳卧长堤。',
    '未时云影移，荷畔鹭鸶栖。',
    '申刻暮风凉，归帆入远江。',
    '酉时霞染树，倦客倚残阳。',
    '戌夜烛灯明，轩窗读旧经。',
    '亥刻漏声沉，幽斋梦蝶深。'
]

function getPoemByHourArray(hour) {
    return poemArray[Math.ceil(hour / 2) >= 12 ? 0 : Math.ceil(hour / 2)]
}

const Workbenches = () => {
    const [Greet, setGreet] = useState('好呀!')
    const [Date, setData] = useState(dayjs().format('HH:mm:ss'))
    const [User, setUser] = useState()
    const [UserAdd, setUserAdd] = useState()

    const { send } = useRequest(data => Http(data), { immediate: false })

    useMount(async () => {
        const user = await GetIndexedDB('user')
        const userAdd = await GetIndexedDB('userAdd')
        setUser(user)
        setUserAdd(userAdd)
    })

    useRafInterval(() => {
        const Time = dayjs().format('HH:mm:ss')
        const [H] = Time.split(':')
        setData(Time)
        setGreet(getPoemByHourArray(H))
    }, 1000)


    useMount(() => {
        send({ method: 'get', url: 'taskExecution/GetWechatTaskExecutionList' }).then(res => {
            console.log('每日任务', res)
        })
        send({ method: 'get', url: 'taskExecution/GetWechatHistoricalPointsList', params: { queryScope: '全部' } }).then(res => {
            console.log('历史任务', res)
        })
    })


    const items = [
        {
            key: '1',
            label: 'Tab 1',
            children: 'Content of Tab Pane 1',
        },
        {
            key: '2',
            label: 'Tab 2',
            children: 'Content of Tab Pane 2',
        },
        {
            key: '3',
            label: 'Tab 3',
            children: 'Content of Tab Pane 3',
        },
    ];

    return (
        <div className='Workbenches'>
            <div className='Content'>
                <div className='UserInfo'>
                    <img className='UserBack' src={UserBackboard[UserAdd?.backImage]} alt="" />
                    <img className='UserAvatar' src={UserAvatar[UserAdd?.avatar]} alt="" />
                    <div className='NickName'>
                        <div>{Greet} </div>
                        <div><span>{UserAdd?.nickName}</span> {User?.organizationName} . {User?.userName}</div>
                    </div>
                    <div className='Date'> {Date} </div>
                </div>
                <div className='Analysis'>
                    <Calendar />
                </div>
            </div>
            <div className='DailySchedule'>
                <div>
                    每日任务列表
                </div>
            </div>
        </div>
    );
};

export default Workbenches;